jQuery: How to make `real-time pager` depending on browser screen size without `content` refreshing?

Posted by Binyamin on Stack Overflow See other posts from Stack Overflow or by Binyamin
Published on 2010-12-22T16:46:01Z Indexed on 2010/12/22 19:54 UTC
Read the original article Hit count: 211

Filed under:
|
|
|

jQuery: How to make real-time pager depending on browser screen size without content refreshing?

Example for it you can see in http://www.nytimes.com/chrome/ alt text

HTML and CSS in http://jsfiddle.net/laukstein/qjGrV/

#content{
    display:block;
    width:100%;
    height:40%;
    min-height:205px;
    max-height:408px;
    overflow:hidden;
}
li{
    width:100px;
    height:100px;
    margin:1px;
    float:left;
    background:#ccc;
}
...
<ul id="content">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    ...
</ul>
<div id="pager"><!--here lets show 1,2,3,4 etc. depending on screen size--></div>

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about paging